<!--
 * @Author: daidai
 * @Date: 2022-03-04 09:23:59
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2022-05-07 11:05:02
 * @FilePath: \web-pc\src\pages\big-screen\view\indexs\index.vue
-->
<template>
  <div style="position: relative;height: 100%;">
    <div class="left-item">
      <div class="contetn_left">
        <div class="pagetab">
        </div>
        <ItemWrap class="contetn_left-top contetn_lr-item" title="在租骑手数量" style="height: 220px;margin-bottom: 10px;">
          <QiShou />
        </ItemWrap>
        <!-- <ItemWrap class="contetn_left-center contetn_lr-item" title="累计注册用户" style="height: 285px;margin-bottom: 10px;">
          <Register />
        </ItemWrap> -->
        <ItemWrap class="contetn_left-bottom contetn_lr-item" title="实时换电人数" style="padding: 0 10px 16px 10px; height: 300px; margin-top: 480px;">
          <BatteryCheck />
        </ItemWrap>
      </div>
    </div>
    <div class="right-item">
        <ItemWrap class="contetn_left-bottom contetn_lr-item" title="电池数量" style="height: 220px;margin-bottom: 10px; ">
          <BatteryNum />
        </ItemWrap>
        <!-- <ItemWrap class="contetn_center-bottom" title="累计行驶里程" style="height: 285px;margin-bottom: 10px;">
          
          <TotalUser />
        </ItemWrap> -->
        <ItemWrap class="contetn_left-bottom" style="height: 300px;margin-top: 480px;" title="每天换电次数曲线 ">
          <LiveOrder />
        </ItemWrap>
    </div>
    <CenterMap class="contetn_center_top" />
  </div>

</template>
<!-- 换电柜子位置，骑手数量，累计骑手，累计里程，每天换电曲线，时实换电人数，电池数 -->
<script>
import BatteryNum from "./batteryNum.vue";
import Register from "./register.vue";
import CenterMap from "./map-2d.vue";
import QiShou from "./qishou.vue";
import TotalUser from "./total-user.vue";
import RightBottom from "./right-bottom.vue";
import BatteryCheck from './battery-check.vue';
export default {
  components: {
    BatteryNum,
    Register,
    CenterMap,
    QiShou,
    TotalUser,
    LiveOrder: RightBottom,
    BatteryCheck
  },
  data() {
    return {

    };
  },
  filters: {
    numsFilter(msg) {
      return msg || 0;
    },
  },
  created() {
  },

  mounted() { },
  methods: {
  }
};
</script>
<style lang="scss" scoped>
// 内容
.right-item, .left-item {
  width: 480px;
  position: absolute;
  height:100%;
  top: 0;
  z-index: 100;
} 
.left-item {
  left: 0;
}
.right-item {
  right: 0;
}
.contetn_center_top {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;
}

</style>
